<template>
	<view class="queryOrder-containser">
			<uni-data-select
				class="selected"
				v-model="value"
				:localdata="range"
				@change="change"
				:style="{ background: '#fff'}"
			></uni-data-select>
			<!-- 订单列表 -->
			<uni-section title="订单列表" type="line">
				 <uni-card v-for="(item, index) in myOrderListData" :key="index"  title="名称" :extra="item.orderName">
				        <view class="card-item">
							<text class="name">价格</text>
							<text class="content">{{ item.orderPrice }}</text>
				        </view>
						
						<view class="card-item">
							<text class="name">数量</text>
							<text class="content">{{ item.orderNumber }}</text>
						</view>
						<view class="card-item">
							<text class="name">时间</text>
							<text class="content">{{ item.orderTime }}</text>
						</view>
						<view class="card-item">
							<text class="name">利润</text>
							<text class="content">{{ item.profit }}%</text>
						</view>
				      </uni-card>
			</uni-section>
	</view>
</template>

<script>
	import {myOrderList,userID} from '../../../api/system/user.js'
	export default {
		data() {
			return {
				value:0,
				range:[
					{ value: 0,text: '已完成' },
					{ value: 1,text: '未完成' }
				],
				userId:'',		//保存动态id的
				myOrderListData:[],
			}
		},
		onLoad(){
			this.myOrderListRes(this.value);
		},
		mounted(){
			
		},
		methods: {
			change(value){
				this.value = value
				this.myOrderListRes(value)
			},
			myOrderListRes(value) {
			console.log(value,'value')
			  userID().then(res=>{
				  let params = `userId=${res}&orderState=${value}`;
				  myOrderList(params).then(res => {
				    console.log('请求成功', res);
				    this.myOrderListData = res;
				  });
			  });
			}
		}
	}
</script>

<style lang="scss">
	.queryOrder-containser{
		padding: 15px 0 0 10px;
		.card-item{
			display: flex;
			justify-content: space-between;
		}
		
	}
	.selected{
		width: 130px;
		height: 30px;
		border-radius: 10px;
		
	}
	.uni-section {
		background-color: #f1f1f1
	}
	.uni-section .card{
		background-color: #fff;
		
	}
</style>
